<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="stylesheet" href="./css/计算.css" />
    <title>计算</title>
  </head>
  <body>
    <div class="conter">
      <!-- 计算公式 -->
      <div class="formula">
        <div class="mula">
          <input class="inputO" oninput="cal()" type="text" />
          <select onchange="cal()" name="" id="">
            <option value="">+</option>
            <option value="">-</option>
            <option value="">*</option>
            <option value="">/</option>
          </select>
          <input class="inputT" oninput="cal()" type="text" />
        </div>
        <div>=</div>
        <input class="result" value="?" />
        <button class="btn">展示</button>
      </div>
      <!-- 计算过程 -->
      <div class="process">
        <div class="con">
          <!-- 加减乘 -->
          <div class="addsub">
            <div class="f1">
              <div></div>
              <div></div>
              <div class="f1-decade">
                <div class="f1-decade-num">1</div>
                <div class="f1-bor">.</div>
              </div>
              <div class="f1-units">3</div>
            </div>
            <div class="f2">
              <div class="f2-symbol">+</div>
              <div class="f2-hundreds">
                <div class="f2-carryh">5</div>
              </div>
              <div class="f2-decade">
                <div class="f2-decade-num">6</div>
                <div class="f2-carryd">7</div>
              </div>
              <div class="f2-units">8</div>
            </div>
            <div class="f3">
              <div></div>
              <div class="f3-hundreds">1</div>
              <div class="f3-decade">2</div>
              <div class="f3-units">3</div>
            </div>
            <div class="f4">
              <div class="f4-kilobit">
                <div class="f4-kilobit-num">1</div>
                <div class="f4-carryk">2</div>
              </div>
              <div class="f4-hundreds">
                <div class="f4-hundreds-num">3</div>
                <div class="f4-carryh-z">7</div>
                <div class="f4-carryh">4</div>
              </div>
              <div class="f4-decade">5</div>
              <div></div>
            </div>
            <div class="f5">
              <div class="f5-kilobit">6</div>
              <div class="f5-hundreds">7</div>
              <div class="f5-decade">8</div>
              <div class="f5-units">9</div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </body>
  <script src="./js/计算.js"></script>
</html>
